

// 初始化图片裁剪器
const image = document.getElementById('image');
const cropper = new Cropper(image, {
    aspectRatio: 1,
    preview: $(".img-preview"),
    // crop(event) {
    //     console.log(event.detail.x);
    //     console.log(event.detail.y);
    //     console.log(event.detail.width);
    //     console.log(event.detail.height);
    //     console.log(event.detail.rotate);
    //     console.log(event.detail.scaleX);
    //     console.log(event.detail.scaleY);
    // },
});

let publisherId = null;

// 获取分类
catesListAPI({}, res => {
    res.data.data.forEach(obj => {
        $("select[name=cate_id]").append(`<option value="${obj.Id}">${obj.name}</option>`);
    })
    layui.use('form', function () {
        var form = layui.form;
        form.render('select'); //刷新select选择框渲染
    });
    // 判断是否编辑页面进去给表单赋值
    publisherId = window.location.search.slice(4); // search 表示url ?(问号) 后面的值
    if (publisherId) { // 有值则表示修改页面
        ArticleIdAPI(publisherId, res => {
            var form = layui.form;
            form.val('editPublisher', res.data.data);
            // console.log(res.data.data.content);
            // 初始化富文本编辑器
            tinymce.init({
                selector: '#textarea',
                language: 'zh_CN',
                plugins: 'table advlist autolink link image lists preview', //字符串方式
                branding: false, // 去除右下角logo
                width: '100%',
                height: 400
            });
            // tinyMCE.activeEditor.setContent(res.data.data.content); // 获取富文本编辑器的内容
            cropper.replace(res.data.data.cover_img);
        })
    } else {
        // 初始化富文本编辑器
        tinymce.init({
            selector: '#textarea',
            language: 'zh_CN',
            plugins: 'table advlist autolink link image lists preview', //字符串方式
            branding: false, // 去除右下角logo
            width: '100%',
            height: 400
        });
    }
})

// 选择封面
$(".select").on('click', function () {
    $("#file").trigger('click');
})

// input:file 检测到发生变化
$("#file").on('change', function (ev) {
    // console.log($('#file')[0].files[0])
    // console.log(ev.target.files[0])
    let imgURL = URL.createObjectURL(ev.target.files[0])
    cropper.replace(imgURL)
})

// 表单提交
$(".layui-form").on('submit', function (ev) {
    ev.preventDefault();
    let fd = new FormData($(".layui-form")[0]);
    var cnt = tinyMCE.activeEditor.getContent(); // 获取富文本编辑器的内容
    fd.set('content', cnt);
    let canvs = cropper.getCroppedCanvas({
        width: 200,
        height: 200
    });
    canvs.toBlob(blob => {
        fd.append('cover_img', blob);
        // fd.forEach((obj, k) => {
        //     console.log(obj, k)
        // })
        if (publisherId) { // 编辑
            fd.append('Id', publisherId);
            editArticleAPI(fd, res => {
                console.log(res)
                window.location.href = '/iframe/article/list/list.html';
            })
        } else { // 新增
            addArticleAPI(fd, (res) => {
                window.location.href = '/iframe/article/list/list.html';
            })
        }
    })
})
